<template>
  <div>
    <mt-header fixed title="注册">
       <router-link to="/denglu" slot="left">
         <mt-button icon="back">返回</mt-button>
       </router-link>
     </mt-header>
     <mt-field label="用户名" placeholder="请输入用户名" v-model="username"></mt-field>
     <mt-field label="密码" placeholder="请输入密码" type="password" v-model="mimima"></mt-field>
     <mt-field label="手机" placeholder="请输入手机号码" type="number"></mt-field>
     <mt-field label="邮箱" placeholder="请输入邮箱" type="email"></mt-field>
     <mt-field label="生日" placeholder="请选择生日" type="date"></mt-field>
     <mt-field label="自我简介" placeholder="这里开始写自我简介" type="textarea" rows="4"></mt-field>



      <mt-button plain size="large" type="default" @click.native="openToastWithIcon">提交</mt-button>

    
  </div>

  </div>
</template>
<script>
import { Toast } from 'mint-ui';
import { mapState } from 'vuex'
  export default {
          data () {
              return {
                  title: '注册',
                  username:'',
                  mimima:''
              }
          },
          methods:{

            openToastWithIcon() {
              if(this.username!==''&&this.mimima!==''){
                  Toast({message: '提交成功',iconClass: 'mintui mintui-success'});
                  this.$store.commit("changename",this.username);
                  this.$store.commit("ceshi",{name:this.username,mima:this.mimima});
                  this.$router.push("/");
              }else{
                alert('请输入完整信息');
              }
              
            }

          }
  }
</script>
<style>
  @component-namespace page {
    @component toast {
      @descendent wrapper {
        padding: 0 20px;
        position: absolute 50% * * *;
        width: 100%;
        transform: translateY(-50%);
        button:not(:last-child) {
          margin-bottom: 20px;
        }
      }
    }
  }
</style>